<template>
  <div class='capdom'>
    <popup :flag='popflag'></popup>
    <div v-if="this.leavel < 1 " class="zhezhao">
      <div class="tishi">当前会员等级不够，需要满一星会员方可推广用户</div>
    </div>

    <div class="dailyPerformance">

      <!-- <div class="dp-search">
        <input type="text" placeholder="输入搜索内容">
        <div class="searchBtn">搜索</div>
      </div> -->
      <div class="middle">
        <tree-table :data="data" :columns="columns" :maxHeight="maxHeight" @pop='popcallback' v-if='maxHeight' />
      </div>
      <!-- <div class="bottom">
        <div class="block">
          <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="currentPage4"
            :page-sizes="[100, 200, 300, 400]"
            :page-size="1"
            prev-text="上一页"
            next-text="下一页"
            layout="prev, pager, next, jumper, total"
            :total= this.total
          ></el-pagination>
        </div>
      </div> -->
    </div>
  </div>
</template>
<script>
import $ from "jquery";
import treeTable from "./../TreeTable";
import popup from "../common/popup.vue";
export default {
  created() {
    this.$parent.flag = true;
    this.getDate();
  },
  name: "dailyPerformance",
  data() {
    return {
      popflag: false,
      popdata: {
        tda: "",
        tdb: "",
        tdc: "",
        tdd: "",
        tde: "",
        tdf: "",
        tdg: "",
        tdt: "",
        tdy: "",
        tdz: ""
      },
      columns: [
        // { value: "tdz", text: "" },
        { value: "tda", text: "账号" },
        { value: "tdb", text: "姓名" },
        { value: "tdc", text: "级别" },
        { value: "tdd", text: "团队级别" },
        { value: "tde", text: "注册时间" },
        { value: "tdf", text: "激活时间" },
        { value: "tdg", text: "联系方式" },
        { value: "tdh", text: "个人业绩" },
        { value: "tdi", text: "关系" },
        { value: "tdj", text: "操作" }
      ],
      data: [],
      leavel: null,
      maxHeight: ""
    };
  },
  components: { treeTable, popup },
  mounted() {
    this.leavel = JSON.parse(localStorage.getItem("userData")).memberLevel;
    let that = this;
    that.maxHeight = document.querySelector(".dailyPerformance>.middle").offsetHeight + "";
    window.onresize = function() {
      that.maxHeight = document.querySelector(".dailyPerformance>.middle").offsetHeight + "";
    };
  },
  methods: {
    popcallback(data) {
      this.popdata.tda = data.tda;
      this.popdata.tdb = data.tdb;
      this.popdata.tdc = data.tdc;
      this.popdata.tdd = data.tdd;
      this.popdata.tde = data.tdh;
      this.popdata.tdf = data.tdn;
      this.popdata.tdg = data.tdg;
      this.popdata.tdt = data.tde;
      this.popdata.tdy = data.tdy;
      this.popdata.tdz = data.tdz;
    },
    // handleSizeChange(val) {
    //   console.log(`每页 ${val} 条`);
    // },
    // handleCurrentChange(val) {
    //   this.currentCount = (val - 1) * 10
    //   this.chushihua()
    //   // console.log(`当前页: ${val}`);
    // },
    getDate() {
      u.userTree({}, data => {
        this.data = data.data.map((el, elIndex) => {
          let arr = el.memberList.map((item, index) => {
            return {
              tda: item.loginName,
              tdb: "*" + item.trueName.substring(1),
              tdc: item.memberLevelString,
              tdd: item.groupLevelString,
              tde: item.registerTime,
              tdf: item.aliveTime,
              tdg: item.phone,
              tdh: item.selfAchievement,
              tdi: "间接推荐",
              tdj: "详情",
              tdn: item.isAliveString,
              tdy: item.groupAchievement,
              tdz: item.depAchievement,
              id: index
            };
          });
          return {
            tda: el.loginName,
            tdb: "*" + el.trueName.substring(1),
            tdc: el.memberLevelString,
            tdd: el.groupLevelString,
            tde: el.registerTime,
            tdf: el.aliveTime,
            tdg: el.phone,
            tdh: el.selfAchievement,
            tdi: "直接推荐",
            tdj: "详情",
            tdn: el.isAliveString,
            tdy: el.groupAchievement,
            tdz: el.depAchievement,
            children: arr,
            id: elIndex
          };
        });
      });
    }
  }
};
</script>
<style lang="stylus" type='text/stylus' scoped>
.capdom {
  height: 100%;
}

.dailyPerformance {
  overflow: hidden;
  padding: 20px 30px;
  width: 100%;
  height: 100%;
  background: white;
  overflow-y: hidden;

  .middle {
    height: 100%;
  }

  .dp-search {
    margin-bottom: 30px;
    height: 40px;

    input {
      padding: 0 14px;
      width: 370px;
      height: 100%;
      font-size: 14px;
      color: #747474;
      outline: none;
      border: 1px solid #c9cfda;
      vertical-align: top;

      &:focus {
        border-color: #ffb001;
      }

      &::-webkit-input-placeholder {
        color: #999999;
      }

      &:-moz-placeholder {
        color: #999999;
      }
    }

    .searchBtn {
      margin-left: 20px;
      display: inline-block;
      width: 75px;
      height: 100%;
      text-align: center;
      line-height: 40px;
      color: white;
      font-size: 14px;
      background: #ffb001;
      border-radius: 2px;
      cursor: pointer;
      vertical-align: top;
    }
  }
}

.zhezhao {
  position: absolute;
  z-index: 999;
  position: absolute;
  height: calc(100% - 165px);
  width: calc(100% - 280px);
  background: rgba(0, 0, 0, 0.5);

  .tishi {
    text-align: center;
    margin-top: 20%;
    font-size: 30px;
    font-weight: bold;
  }
}
</style>
<style>
</style>




